
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>新闻信息</title>
		<!--引入layui的css  -->
		<link rel="stylesheet" href="../../lib/layui/css/layui.css" media="all">
	
	</head>
	<!--引入layui的js  -->
	<script src="../../lib/layui/layui.js" charset="utf-8"></script>
	<!--引入jquery的js  -->
	<script src="../../../lib/jquery/jquery.min.js" charset="utf-8"></script>
	
	<body>
	<!-- 查询条件输入框 -->
	<div class="layui-form-item" style="margin-top: 10px;">
		<form class="layui-form" onsubmit="return false;">
			<label class="layui-form-mid">新闻标题名称:</label>
			<div class="layui-input-inline" style="width: 120px;">
				<input type="text" id="newstypename" name="newstypename" autocomplete="off" class="layui-input">
			</div>

			<div class="layui-input-inline" style="width: 300px;">
				<button class="layui-btn" lay-submit="" lay-filter="search" id="search" data-type="reload"><i class="layui-icon">&#xe615;</i>搜索</button>
				<button class="layui-btn layui-btn-normal" type="reset" ><i class="layui-icon">&#xe666;</i>重置</button>
			</div>
		</form>
	</div>
	

		<!--定义数据表格table  -->
		<table class="layui-hide" id="proTable" lay-filter="filterTable"></table>
		
		<!--表格数据里的编辑、查看等操作按钮  -->
		<script type="text/html" id="barDemo">
			<a class="layui-btn layui-btn-xs layui-btn-primary" lay-event="edit"><i class="layui-icon">&#xe642;</i>编辑</a>	
			<a class="layui-btn layui-btn-xs layui-btn-danger" lay-event="del"><i class="layui-icon">&#xe640;</i>删除</a>
		</script>
		
		<!--表格工具栏的新增、批量等按钮  -->
		<script type="text/html" id="toolbarDemo">
  		<div class="layui-btn-container">
    		<button class="layui-btn layui-btn-sm layui-btn-normal" lay-event="add"><i class="layui-icon">&#xe654;</i>添加</button>
  		</div>
		</script>

		<script>
			layui.use(['laydate','layer','form','table','tree','upload','transfer'], function() {
				var laydate = layui.laydate	//日期组件
					,layer = layui.layer	//弹层组件
					,form = layui.form		//表单组件
					,upload = layui.upload  //上传组件
					,tree = layui.tree		//树形结构组件
					,$= layui.jquery    	//jQuery
					,table = layui.table	//表格组件
					,transfer = layui.transfer; //穿梭框组件
					
					
				//渲染表格，填充数据
			 	table.render({
					elem: '#proTable',			//对应上面定义的表格ID
					url: '../../../admin/newstype?reqName=list',					//提交到后台的地址
					method: 'get',				//提交方式 get或者post
					even: true, 				//表格隔行变色
					page: true,					//开启分页
					toolbar: '#toolbarDemo', 	//开启头部工具栏，并为其绑定左侧模板
					title: '新闻表', 				//表格名称
					cols: [
						[{
							field: 'ck',
							fixed: 'left',
							type: 'checkbox',
							width: 100
						},{
							field: 'newstypeid',	//对应实体类里的属性    （必需有）
							fixed: 'left',	//固定方式，left左固定，right右固定 （可选）
							align:'center', //排列方式：left左对齐，center居中，right右对齐（可选）
							width: 80,		//单元格宽度（可选）	
							title: 'ID',	//表头名称			（必需有）
							sort: true		//开启排序（可选）
						}, {
							field: 'newstypename',	//对应实体类里的属性
							title: '新闻标题'		//表头名称
						},{
							fixed: 'right',
							width: 150,
							title: '操作',
							toolbar: '#barDemo'
						}]
					]
				});
					
			
				/*
					条件查询	submit 对应 lay-submit  search 对应 lay-filter
				*/
			    form.on('submit(search)', function (data) {
	                var field = data.field;		//获取所有的输入条件值
	                //执行重载
	                table.reload('proTable', {
	                    page: { curr: 1 }, 		// 重载后回到第一页
	                    where: field			// 把所有的输入值传给后台
	                });
	            }); 
				
				//表格头部工具栏事件
				table.on('toolbar(filterTable)', function(obj){
				    switch(obj.event){
				    	//新增按钮
				      case 'add':
				    			
						 	//打开新增的弹层
							layer.open({
								type:2, 
								title: '您正在新增产品信息',
								content: 'add.html',
								area: ['60%','80%']
							});
				      break;
				    }
				  });
				
			  	//数据表格里的事件监听
				table.on('tool(filterTable)',function(obj){
					var data = obj.data;//获取当前行的数据
					
					switch(obj.event){
				      case 'edit':		//修改操作
				    	//打开弹层
							layer.open({
								type:2, 
								title: '您正在修改产品信息',
								content: 'edit.html',
								area: ['60%','80%'] ,
								success: function(layero, index){
					            	//找到它的子窗口的body
					                 var body = layer.getChildFrame('body', index); //巧妙的地方在这里哦
					                 //为子窗口元素赋值,数据回显
					                 body.find("input[name=newstypeid]").val(data.newstypeid);
					                 body.find("input[name=newstypename]").val(data.newstypename);
					                
					                /*  body.find('input[name=manager][value = ' + data.manager + ']').attr("checked",
					                 "checked");
					                 form.render("radio"); */
					             }
							});
				      break;
				      case 'del':		//删除操作
				    		if(confirm("确定删除吗？")){
				    			$.ajax({
									type: 'post', 					//提交方式get或post
									url: '../../../admin/newstype?reqName=delete',	 					//提交路径
									data: {"newstypeid":data.newstypeid}, 			//参数
									dataType: 'json', 				//返回的数据类型
									success: function(res) { 		//提交成功
										layer.alert(res.msg);		//提示信息
										table.reload('proTable',{page:{curr:1}}) 	// 删除后要刷新表格
									},
									error: function() { //提交失败
										alert("系统异常！！")
									}
								}); 
				    		}
				      
			      	  break;
			    	};
				})
				
				
			});
			
			
		</script>
	</body>
</html>
